<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="keywords" content="HTML"/>
    <link rel="shortcut icon" href="https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=2845730974,512985385&fm=26&gp=0.jpg"/>
    <title>demo1</title>
    <meta name="description" content="测试"/>
    <meta name="author" content="ytf"/>
    <style>
        table, th, td {
            border-collapse: collapse;
        }
        td{
            margin: 0;
            padding: 20px;
            border: 1px solid red;
            border-collapse: collapse;
        }
        td:hover{
            background-color: #fd0ec1;
            color: white;
        }
    </style>
</head>
<body>
<h1>h1标题</h1>
<hr color="red" size="1"/>
<h2>h2标题</h2>
<hr/>
<h3>h3标题</h3>
<hr/>
<h4>h4标题</h4>
<hr/>
<h5>h5标题</h5>
<hr/>
<h6>h6标题</h6>
<p>这是段落</p>
<div>
    <p>文本格式化</p>
    <strong>加粗字体</strong><em>斜体字体</em><q>中国加油</q>
    <code>
        this is program code
    </code>
</div>
<div>
    <a href="https://www.baidu.com" target="_self" rel="nofollow">当前页面打开百度首页</a>
    <a href="https://www.baidu.com" target="_blank" rel="nofollow">新页面打开百度首页</a>
    <img usemap="#gallary" src="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=2164170887,2228066289&fm=26&gp=0.jpg" alt="银河" width="333" height="219">
    <map name="gallary">
        <area shape="rect" coords="0,0, 100, 100" alt="左上角百度" href="https://www.baidu.com" target="_blank">
        <area shape="rect" coords="200, 100, 333, 219" alt="右下角google" href="https://www.google.com" target="_blank">
    </map>
</div>
<table>
    <thead>方向</thead>
    <tbody>
        <tr>
            <td></td>
            <td>北</td>
            <td></td>
        </tr>
        <tr>
            <td>西</td>
            <td></td>
            <td>东</td>
        </tr>
        <tr>
            <td></td>
            <td>南</td>
            <td></td>
        </tr>
    </tbody>
</table>
<section >asdfasdf</section>
</body>
</html>